<template>
  <div class="loading_container" v-show="visible">
      <div class="loading_wrapper">
          <div>
              <div class="loading-content">
                  <img src="../../assets/u=1994813006,2468896996&fm=26&gp=0.jpg" alt="">
              </div>
              <div></div>
          </div>
      </div>
  </div>
</template>

<script>
export default {
    props:{
         isShow:{
             type:Boolean,
             default:false,
         }
    },
    data() {
        return {
           visible:false
        }
    },
    methods:{
        close(){
            setTimeout(()=>{
               this.visible =false;
            },2000)
           
        }
    }
}
</script>

<style scoped>
.loading_container{
    width: 100vw;
    height: 100vh;
    position: fixed;
    left: 0px;
    top: 0px;
    /* background-color: rgba(0, 0, 0, 0.5); */
    z-index: 999;
}
.loading_wrapper{
    width: 100%;
    height: 100%;
    display: inline-flex;
    justify-content: center;
    align-content: center;
}
.loading-content{
    width: 50vw;
    position: absolute;
    left: 4.5rem;
    top: 10rem;
}
.loading-content img{
    width: 100%;
}
</style>